<template>
	<view class="zh-service-link">
		<u-mask :show="props.show" @click="handleClickMask"></u-mask>
		<view class="box">
			<view class="top">
				<image src="" class="wx-code" />
			</view>
			<view class="bottom">
				<text class="font-36 font-bold">扫一扫二维码，添加客服微信</text>
				<button class="mt-60">保存到相册</button>
				<button class="app-primary-button mt-40">联系TA</button>
			</view>
		</view>
	</view>
</template>

<script setup lang="ts">
	const props = defineProps < {
		show ? : boolean
	} > ()
	const emit = defineEmits(['close', 'click'])

	const handleClickMask = () => {
		emit('close')
	}
</script>

<style lang="scss" scoped>
	.zh-service-link {
		.box {
			position: fixed;
			top: 199rpx;
			left: 40rpx;
			right: 40rpx;
			background-color: $uni-bg-card-color;

			.top {
				background: linear-gradient(90deg, #1769FF, #3795FF);
				border-radius: 8px 8px 0px 0px;
				text-align: center;
				padding-top: 80rpx;

				.wx-code {
					width: 280rpx;
					height: 280rpx;
					background-color: #fff;
					border-radius: 10rpx;
				}
			}

			.bottom {
				padding: 100rpx 112rpx 40rpx;
				text-align: center;
			}
		}
	}
</style>
